<extend name="Base/common"/>
<block name="head">
    <style type="text/css">
        html, body {
            background-color: #ECECF2;
        }

        a {
            color: white;
            text-decoration: none;
        }

        a:link {
            color: white;
            text-decoration: none;
        }

        a:visited {
            color: white;
            text-decoration: none;
        }

        a:hover {
            color: white;
            text-decoration: none;
        }

        a:active {
            color: white;
            text-decoration: none;
        }

        .clearfix:after {
            content: '';
            display: block;
            clear: both;
            height: 0;
            visibility: hidden;
        }

        .sidebar {
            width: 250px;
            position: absolute;
            z-index: 0;
        }

        .sidebar ul {
            margin-left: 40px;
            margin-top: 60px;
        }

        .sidebar ul li {
            list-style-type: none;
            margin: 20px auto;
            font-size: 15px;
            cursor: pointer;
        }

        .sidebar .dtitle {
            margin-left: -40px;
            font-size: 18px;
            font-weight: 900;
            cursor: text;
        }

        .sideright {
            margin-left: 250px;
            position: relative;
            z-index: 10;
            background-color: white;
        }

        .hiddenbtn {
            height: 35px;
            width: 35px;
            border-radius: 50%;
            border: 1px solid #333333;
            cursor: pointer;
            margin: 8px 0 0 8px;
        }

        .hiddenbtn span {
            display: block;
            font-size: 20px;
            line-height: 30px;
            vertical-align: middle;
        }

        .infoset {
            height: 800px;
            background-color: white;
        }

        .infoset .formvalue {
            margin-left: 50px;
            font-size: 16px;
        }

        .infoset .changepwd, .infoset .gradesel, .infoset .gradesel, .infoset .baseinfo, .infoset .personcheck, .infoset .companycheck {
            width: 400px;
            padding-top: 10%;
        }

        .infoset .baseinfo {
            /*display: none;*/
        }

        .infoset .changepwd {
            display: none;
        }

        .infoset .personcheck {
            display: none;
        }

        .infoset .gradesel {
            display: none;
        }

        .infoset .companycheck {
            display: none;
        }

        .infoset .changemodul {
            display: none;
        }

        @media (max-width: 430px) {
            .infoset {
                height: 700px;
            }

            .infoset .changepwd, .infoset .gradesel, .infoset .baseinfo, .infoset .personcheck, .infoset .companycheck {
                width: 300px;
            }
        }
    </style>
</block>
<block name="body">
    <div style="overflow: hidden;">
        <!-- 左侧的列表 -->
        <div class="sidebar pull-left">
            <ul>
                <li class="dtitle">基本信息</li>
                <li onclick="changeColor($(this),$('.baseinfo'))" style="color: #87ACF4;">领队资料</li>
                <li onclick="changeColor($(this),$('.changepwd'))">修改密码</li>
                <li onclick="changeColor($(this),$('.gradesel'))">成绩查询</li>
                <li class="dtitle">身份认证</li>
                <eq name="_user.u_type" value="1">
                    <li onclick="changeColor($(this),$('.personcheck'))">个人认证</li>
                </eq>
                <eq name="_user.u_type" value="0">
                    <li onclick="changeColor($(this),$('.companycheck'))">机构认证</li>
                </eq>
                <eq name="_user.u_type" value="2">
                    <li onclick="changeColor($(this),$('.personcheck'))">个人认证</li>
                    <li onclick="changeColor($(this),$('.companycheck'))">机构认证</li>
                </eq>
                <li class="dtitle">我的赛事</li>
                <li onclick="changeColor($(this),$('.myMatch'))">我的赛事</li>
            </ul>
            <a href="{:U('manage/manage')}" class="btn btn-info center-block" style="width: 150px;"><span
                    class="glyphicon glyphicon-home"></span>
                返回首页</a>
        </div>
        <!-- 右边的主体区域 -->
        <div class="sideright clearfix">
            <!-- 左上角的切换按钮  -->
            <div class="hiddenbtn text-center"
                 onmouseover="changeAttr($(this),{border:'1px solid #eabf75',color:'#eabf75'})"
                 onmouseout="changeAttr($(this),{border:'1px solid #333333',color:'#333333'})" onclick="sideToggle()">
                <span class="glyphicon glyphicon-list"></span>
            </div>
            <!-- 提交信息部分 -->
            <div class="infoset">
                <!-- 搜索部分 -->
                <div class="gradesel center-block" id="zj-bh-search">
                    <form name="selectback" class="form-inline">
                        <div class="form-group">
                            <div class="input-group">
                                <span class="input-group-addon">背号</span>
                                <input type="text" class="form-control" placeholder="backnumber" v-model="bh_id">
                            </div>
                            <div class="input-group">
                                <button type="button" @click="search();" class="btn btn-sm btn-primary">查询</button>
                            </div>
                        </div>
                    </form>
                    <div class="result_back" style="margin-top: 20px;">
                        <table class="table table-bordered table-hover">
                            <thead>
                            <tr>
                                <th></th>
                                <th></th>
                                <th></th>
                                <th></th>
                                <th></th>
                            </tr>
                            </thead>
                        </table>

                    </div>
                </div>

                <script>

                    new Vue({
                        el: '#zj-bh-search',
                        data: {bh_list: [], bh_id: ''},
                        methods: {
                            search: function () {
                                var bh_id = this.$data.bh_id;
                                $.post("{:U('Manage/select_back')}", {bh_id: bh_id}, function (ret) {
                                    console.log(ret);
                                    if (ret.length <= 0) {
                                        layer.msg('未查询到背号数据');
                                    }
                                });
                            }
                        }
                    });
                </script>
                <!-- 我的赛事部分 -->
                <div class="myMatch center-block" style="display: none;">
                    <div class="applied">
                        <table class="table" id="allMatch">
                            <tr style="background-color: #F2F3F7;">
                                <th>背号</th>
                                <th>姓名</th>
                                <th>组别</th>
                                <th>比赛开始时间</th>
                                <th>项目代号</th>
                                <th>状态</th>
                                <th>分数</th>
                                <th>操作</th>
                            </tr>
                            <volist name="join_list" id="vo">
                                <tr>
                                    <td>{$vo.back_num}</td>
                                    <td>{$vo.u_name}</td>
                                    <td>{$vo.g_name}{$vo.g_type}</td>
                                    <td>{$vo.g_start}</td>
                                    <td>{$vo.g_short}</td>
                                    <td>
                                        <if condition="$vo.j_status eq 0">未支付
                                            <else/>
                                            <if condition="$vo.j_note eq 0">已线下支付
                                                <else/>
                                                已支付
                                            </if>
                                        </if>
                                    </td>
                                    <td>
                                        <if condition="$vo.g_grade eq 0">未出成绩
                                            <else/>
                                            {$vo.gr_grade}
                                        </if>
                                    </td>
                                    <td>
                                        <a href="__URL__/apply" class="btn btn-info">结算支付</a>
                                    </td>
                                </tr>
                            </volist>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <script type="text/javascript">
        var c = 1,
                t = 60;
        function changeAttr(obj, styles) {
            obj.css(styles);
        }
        function showTable(obj) {
            obj.css("display", "block").siblings().css("display", "none");
        }
        function changeColor(obj1, obj2) {
            obj1.css("color", "#87ACF4").siblings().css("color", "#333333");
            showTable(obj2);
        }
        function sideToggle() {
            if (c == 1) {
                $(".sideright").animate({
                    marginLeft: "0px"
                }, 300);
                c = -1;
            } else if (c == -1) {
                $(".sideright").animate({
                    marginLeft: "250px"
                }, 300);
                c = 1;
            }
        }
        function countTime(obj) {
            obj.attr("disabled", "disabled");
            var count = setInterval(function () {
                obj.attr("value", t + "秒");
                t--;
                if (t < 0) {
                    t = 60;
                    clearInterval(count);
                    obj.removeAttr("disabled");
                    obj.attr("value", "获取验证码");
                }
            }, 1000);
        }
        function getValue(oder) {
            if (oder = 1) {
                $(".baseinfo .changemodul").eq(0).children("input.form-control").attr("value", $(".baseinfo .formvalue").eq(0).text());
                $(".baseinfo .changemodul").eq(1).children("input.form-control").attr("value", $(".baseinfo .formvalue").eq(1).text());
                $(".baseinfo .changemodul").eq(2).children("input.form-control").attr("value", $(".baseinfo .formvalue").eq(2).text());
                $(".baseinfo .changemodul").eq(3).children("input.form-control").attr("value", $(".baseinfo .formvalue").eq(3).text());
            }
            if (oder = 3) {
                $(".personcheck .changemodul").eq(0).children("input.form-control").attr("value", $(".personcheck .formvalue").eq(0).text());
                $(".personcheck .changemodul").eq(1).children("input.form-control").attr("value", $(".personcheck .formvalue").eq(1).text());
                $(".personcheck .changemodul").eq(2).children("input.form-control").attr("value", $(".personcheck .formvalue").eq(2).text());
            }
            if (oder = 4) {
                $(".companycheck .changemodul").eq(0).children("input.form-control").attr("value", $(".companycheck .formvalue").eq(0).text());
                $(".companycheck .changemodul").eq(1).children("input.form-control").attr("value", $(".companycheck .formvalue").eq(1).text());
            }
        }
        function change(thisObj, formObj, order) {
            thisObj.removeClass("center-block").addClass("pull-left").next().css("display", "block");
            formObj.find("span.formvalue").css("display", "none");
            formObj.find("div.changemodul").css({
                display: "table"
            });
            getValue(order);
        }
        function out(obj) {
            obj.style.display = "none";
        }

        //验证  demo
        function showInt(str) {
            if (str.length >= 18) {
                var checkUrl = "{:U('Manage/checkIdCard')}";
                var realName = $("#zj-real-name").val();
                $.post(checkUrl, {realname: realName, cardid: str}, function (ret) {
                    alert(ret.info);
                });
            }
        }

        $(function () {


            $("form[name=phone_change]").submit(function () {
                $.ajax({
                    type: "POST",
                    url: "__URL__/savepassword",
                    data: $(this).serialize(),
                    dataType: "json",
                    success: function (data) {
                        if (data.status == 1) {
                            alert(data.info);
                            location.href = data.url;
                        } else {
                            alert(data.info);
                        }
                    }
                });
                return false;
            });

        });


    </script>
</block>